تا به حال شاید با سایت های زیادی در  اینترنت رو به رو شده باشید و حتی سایت کلاس من! تمام این سایت ها دارای کد نویسی اختصاصی هستند. حال کد نویسی های مختلفی وجود دارد و بخش های مختلفی است. اما آنچه شما می بینید حاصل html است. html  زبانی است که می تواند صفحات وب را به مرورگر ها بشناسد و مرورگر ها می توانند آن را بخوانند و به صورت ظاهری برای کاربران نشان دهند. خب به مرور ما با کد نویسی های دیگر نیز آشنا خواهیم شد و دوره های جانبی نیز برای آن ها قرار داده خواهد شد. اینک با کلاس من همراه باشید و اولین قسمت آموزش html را به خوبی بخوانید.

html چیست؟

همانطور که در ابتدا نیز توضیح داده شد،html زبانی است که فارغ از برنامه نویسی های سرور و ... به مرورگر داده می شود و کار اصلی مرورگر ها خواندن این کد ها و ترجمه ی آن به صورت ظاهری برای کاربران است.البته برای این موضوع باید توجه داشته باشید که html به تنهایی نمی تواند ظاهر را کامل کند و نیاز به کد نویسی ظاهری نیز می باشد که بخش دیگری از آموزش هاست که به آن نیز می پردازیم. این کد نویسی ظاهری css نام دارد. اگر بخواهیم که html و css را با هم مقایسه کنیم بهترین مثال این است که شما یک ماشین که ساخته شده را در نظر بگیرید. css همانند رنگ ماشین است که به html رنگ و ظاهر بهتری می دهد و html همانند بدنه ی ماشین بدون رنگ است. هیچگاه نیز ماشین بدون رنگ عرضه نمی شود و در صفحات وب نیز به این گونه است و همواره html با css می آید.

شروع کد نویسی و بخش های مختلف صفحه html

خب در حال حاضر یک نمونه کد از یک صفحه اچ تی ام ال را برای شما قرار خواهیم داد و بخش بخش ان را توضیح خواهیم داد. در ابتدا شاید این کد ها عجیب و سخت به نظر بیاد اما کم کم با کل آن آشنا خواهید شد.

توجه داشته باشید که برای یادگیری کد نویسی باید دست به کار شوید. این یک کتاب داستان نیست که فقط بخوانید، بلکه یک آموزش است و برای فراگیری باید حتما دست به کار شده و همراه آموزش کد ها را تست کنید و تغییرات خود را ایجاد کنید تا بر موضوع مسلط شوید.

خب این نمونه کد پایه ی html  که در بالا مشاهده می کنید. خب در نگاه اول چند سوال برای شما ایجاد می شود که به ترتیب به آن ها پاسخ می دهیم.

چرا هر تگ دو بار تکرار شده و بار دوم علامت "/" در ابتدای آن است؟

در حالت کلی در برنامه نویسی هر کد که باز می شود باید بسته شود. خب در html به صورت تگ باز و بسته می شود. برای بستن تگ ابتدای تگ علامت "/" قرار داده می شود. در حال کلی هم تگ ها داخل "<>" قرار می گیرند.

معنی تگ head در html چیست؟

خب همانطور که مشاهده می کنید کد head  همانند body داخل تگ html قرار گرفته است. خب پس می توانید نتیجه بگیرید که مادر این دو تگ html است یا این دو تگ زیر مجموعه تگ html است. بنابراین صفحه ی html ما به دو بخش head و body تقسیم شده است. از معنی هد مشخص است که در این بخش بیشتر بخش های اصلی و معرفی متن و ... قرار می گیرد و در بخش body مطالب اصلی و ... قرار می گیرد. حال باید کمی صبر داشته باشید تا مواردی که دقیقا داخل head قرار می گیرد را در مطالب آینده بیان کنیم.

روش تمرین کد های html چگونه است؟

برای تمرین کد های html به هیچ برنامه ای نیاز نیست یه فایل با پسوند .html ایجاد کنید مثلا index.html می باشد. حال کد های بالا را داخل فایل تایپ کنید توجه داشته باشید که کد ها به صورت تصویر است تا شما تمامی کد ها را با دست بنویسید. پس از ان که کد ها در فایل ذخیره کردید می توانید فایل را با کروم یا موزیلا باز کنید و نتیجه را ببنید. پس از هر تغییر با رفرش صفحه، می توانید نتیجه را ببینید.

حال اگر فایل خود را با chrome باز کنید حتما شاهد یک صفحه ی سفید خواهید بود. برای این که شما بتوانید نوشته را ببنید کافی است در تگ body جمله ای بنویسید تا به نمایش درآید. حال ممکن است برخی به اشتباه در ادامه ی تگ و درون "<>" نوشته ای بنویسند. این اشتباه است! 

وقتی بیان می شود که داخل یک تگ یعنی بین شروع و پایان ان تگ نوشته شود.

امیدواریم که این آموزش مفید واقع شده باشد و در آینده می توانید آموزش های کامل تر html را از کلاس من دریافت کنید.